Component({
  data: {
    selectIndex: 999,
    isExpend: false,
    selectedMain: '',
    filterList: [],
  },
  properties: {
    filters: {
      type: Object,
      value: {main: [], other: []}
    }
  },
  lifetimes: {
    attached() {
      this.setData({filterList: this.properties.filters.other});
    }
  },
  methods: {
    selectTab: function(e) {
      const label = e.currentTarget.dataset.label;
      const index = this.properties.filters.main.findIndex(item => item.label === label);
      this.setData({selectIndex: index});
    },
    expendSelect: function(e) {
      this.setData({isExpend: true});
    },
    toFilter: function(e) {
      this.setData({isExpend: false});
    },
    selectMain: function(e) {
      const label = e.currentTarget.dataset.label;
      this.setData({selectedMain: label});
    },
    selectOther: function(e) {
      const index = e.currentTarget.dataset.index;
      const parentIndex = index.split('-')[0];
      const childIndex = index.split('-')[1];
      let arr = this.data.filterList;
      arr[parentIndex][childIndex].isSelected = !arr[parentIndex][childIndex].isSelected;
      this.setData({filterList: arr});
    },
    toReset: function() {
      const arr = this.data.filterList.map(item => item.map(it => ({...it, isSelected: false})));
      this.setData({filterList: arr, selectedMain: ''});
    },
    toFilter: function() {
      const {filterList, selectedMain} = this.data;
      const arr = filterList.flat().filter(item => item.isSelected).map(item => item.label);
      this.triggerEvent('filtermoment', {main: selectedMain, other: arr});
      this.setData({isExpend: false});
    },
    handleMask: function() {
      this.setData({isExpend: false});
    }
  }
})